<!doctype html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>Baidu Maps Marker By IJH.CC</title>
		<style>
			html { height: 100%;overflow:hidden;}
			body { height: 100%; margin: 0; padding: 0; background-color: #FFF;font-size: 11px;}
			.button{-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;background-color: #4d90fe;background-image: -webkit-linear-gradient(top,#4d90fe,#4787ed);background-image: -moz-linear-gradient(top,#4d90fe,#4787ed);background-image: -ms-linear-gradient(top,#4d90fe,#4787ed);background-image: -o-linear-gradient(top,#4d90fe,#4787ed);background-image: linear-gradient(top,#4d90fe,#4787ed);border: 1px solid #3079ed;color: #fff;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;cursor: default;font-weight: bold;text-align: center;white-space: nowrap; margin-right: 16px; height: 27px; line-height: 25px; min-width: 54px; outline: 0px; padding: 0 8px;}
		</style>
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=824a595f958e444b737a5bc6325ad44f"></script>
		<script>
		function GetQueryString(name) {
			var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
			var r = window.location.search.substr(1).match(reg);
			if (r != null) return unescape(r[2]); return null;
		}
			var map, geocoder;
			var P = {};
            var G = parent.window.G || {};
			function initialize() {
				map = new BMap.Map('map_canvas');
				P.lng = GetQueryString("lng") || '';
				P.lat = GetQueryString("lat") || '';
                var city = G.city || '上海';
                if(P.lng && P.lat){
				    SetMapPoint(P);
                    var point = new BMap.Point(P.lng, P.lat);
                    map.centerAndZoom(point, 11);
                }else{
                    map.centerAndZoom(city, 12);
                    var point = map.getCenter();
                }
				map.addControl(new BMap.NavigationControl());
				map.enableScrollWheelZoom();
				var marker = new BMap.Marker(point);
				map.addOverlay(marker);
				marker.enableDragging();
				var gc = new BMap.Geocoder();
				gc.getLocation(point, function(rs){
					var addComp = rs.addressComponents;
					var address = [addComp.city].join('');
				});
				marker.addEventListener("dragging", function(e){SetMapPoint(e.point);});
				map.disableDoubleClickZoom();
				map.addEventListener("dblclick", function(e){
					marker.setPosition(e.point);
					SetMapPoint(e.point);
				});
			}
			function SetMapPoint(point){
				P = point;
				document.getElementById("Baidu_Map_Marker").value =  P.lng + ", " + P.lat;				
			}
			function search(address) {
				if (!map) return;
				if(!address){
					alert("请输入有效的定位地点");
					return ;
				}
				var local = new BMap.LocalSearch(map, {
					renderOptions: {map: map,autoViewport: true,selectFirstResult: false}
				});
				local.search(address);
			}
        window.onerror=function(){return true;}
		</script>
	</head>
	<body onload="initialize();">
		<div style="padding:3px 8px;border-bottom:1px solid #dedede;">
			<label style="display:inline-block;">
				<input type="text" value="" id="Baidu_Map_SO_Key" style="width:150px;height:21px;padding:3px 5px;border:1px solid #CCC;"/>&nbsp;&nbsp;
				<button id="Baidu_Map_SO_Btn" class="button" onclick="search(document.getElementById('Baidu_Map_SO_Key').value)">定位</button>
			</label>
			<label style="float:right;line-height:21px;padding:3px 5px;display:inline-block;"><b>坐标</b>：<input type="text" value="" id="Baidu_Map_Marker" style="width:150px;height:21px;padding:3px 5px;border:1px solid #CCC;"  readonly/></label>
			<div style="clear:both;"></div>
		</div>
		<div id="map_canvas" style="width:100%; height:100%"></div>
	</body>
</html>